<template>
  <page-wrap :bgColor="dynamicColor" :showTop="false" hideTab>
    <view
      class="share-parse"
      :style="'padding-top:' + navHeight + 'px;height:cal(100vh)'"
    >
      <view class="share-parse-form-wrap">
        <u-form
          class="share-parse-form"
          label-position="top"
          ref="uForm"
          :model="form"
          :error-type="['message']"
        >
          <view class="form-top">
            <view class="form-top-title">职途卡</view>
            <view class="form-top-subtitle">为你量身打造的成长指南</view>
          </view>
          <view
            class="form-item-wrap"
            v-for="(item, index) in formList"
            :key="index"
            @click.capture="handleSelect(item)"
          >
            <u-form-item
              :class="{ pick: item.comp }"
              :label="item.label"
              :label-style="labelStyleObj"
              :prop="item.prop"
              :required="item.required"
            >
              <u-input
                class="form-input"
                v-model="form[item.prop]"
                :disabled="!!item.comp"
                :placeholder="item.inputPlaceholder"
                :clearable="false"
                :type="item.type || 'text'"
              />
              <!-- 下拉选择 -->
              <u-select
                class="form-select"
                v-model="showSelect"
                :list="item.data"
                v-if="item.comp === 'select'"
                @confirm="handleConfirm($event, item)"
              ></u-select>
              <!-- 自定义选择 -->
              <u-popup
                class="form-comp majorClass"
                v-model="showMajorClass"
                mode="bottom"
                z-index="100"
                safe-area-inset-bottom
                v-if="item.comp == 'majorClass'"
              >
                <view class="classPopupContainer">
                  <view class="classPopupContent">
                    <view class="classPopupTitle">选择班级</view>
                    <view class="classPopupMajorName">{{
                      form.positionTag
                    }}</view>
                    <scroll-view class="classPopupYearContainer" scroll-y>
                      <view
                        class="classPopupYearList"
                        v-for="(classYearItem, classYearIndex) in classList"
                        :key="classYearIndex"
                      >
                        <viwe class="classPopupYearTitle">
                          {{ classYearItem.year }}级
                        </viwe>
                        <view class="classPopupClassList">
                          <view
                            :class="{
                              classPopupClassItem: true,
                              active:
                                classItem.majorClassId ==
                                selecetedMajorClass.majorClassId,
                            }"
                            v-for="(
                              classItem, classIndex
                            ) in classYearItem.class"
                            :key="classIndex"
                            @click="handleClassItemClick(classItem)"
                          >
                            {{
                              classItem.classDesc
                                ? classItem.classDesc
                                : classItem.tagClass + '班'
                            }}
                          </view>
                        </view>
                      </view>
                    </scroll-view>
                  </view>
                  <view class="classPopupBtn">
                    <view
                      class="classPopupBtnItem"
                      @click="handleConfirmMajorClass"
                    >
                      确定
                    </view>
                  </view>
                </view>
              </u-popup>
              <WantJobPopup
                :show.sync="showWantJob"
                @close="handleCloseWantJobPopup"
                @emitParams="handleGetWantJobParams"
                v-if="item.comp == 'wantJob'"
              ></WantJobPopup>
            </u-form-item>
          </view>
        </u-form>
      </view>
      <view class="share-parse-opt">
        <u-button
          class="save-btn"
          :custom-style="saveBtnStyle"
          :hair-line="false"
          :loading="loading"
          @click="handleSave"
          >去使用</u-button
        >
      </view>
    </view>
    <LoginDialog
      ref="loginDialog"
      @loginSuccessBack="loginSuccessBack"
    ></LoginDialog>
  </page-wrap>
</template>

<script>
import {
  saveStuInfo,
  getCustomerInfo,
  getStudentInfo,
  campusGetClassList,
  addBuryingPoint,
  cardRegist,
  getUserInfo,
  getCardPersonRightNum,
  getPersonOneRight,
} from '@/api/modules/career';
import LoginDialog from '@/components/LoginDialog';
import WantJobPopup from './components/WantJobPopup.vue';
import { env } from '@/api/root';
import { ztBurryPoint } from '@/api/modules/career';

export default {
  name: 'dataCenterParse',
  components: {
    LoginDialog,
    WantJobPopup,
  },
  data() {
    return {
      roleType: '',
      rightId: '',
      cardType: '',
      navHeight: getApp().globalData.navHeight,
      dynamicColor: '#FFF',
      navHeight: getApp().globalData.navHeight,
      personId: uni.getStorageSync('person-id').slice(2) || undefined,
      form: {
        stuNum: '',
      },
      isHasSelectMajorClass: false, //是否已经选择班级
      hasClassInfo: false, //是否有班级信息
      selectedPositionTag: {},
      selecetedMajorClass: {},
      classList: [],
      formList: [
        {
          label: '填写学号',
          prop: 'stuNum',
          inputPlaceholder: '必填',
          type: 'number',
          required: true,
        },
        {
          label: '选择专业',
          prop: 'positionTag',
          propVal: 'positionTagId',
          inputPlaceholder: '必填',
          comp: 'positionTag',
          activeParent: '',
          required: true,
        },
        {
          label: '选择求职意向',
          prop: 'extraDisplay',
          propVal: 'extra',
          inputPlaceholder: '必填',
          comp: 'wantJob',
          show: 'showWantJob',
          activeParent: '',
          required: true,
        },
      ],
      rules: {
        stuNum: [
          {
            required: true,
            message: '请输入学号',
          },
        ],
        positionTag: [
          {
            required: true,
            message: '请选择专业',
          },
        ],
        majorClassName: [
          {
            required: true,
            message: '请选择班级',
          },
        ],
        extraDisplay: [
          {
            required: true,
            message: '请选择求职意向',
          },
        ],
      },
      customStyle: {
        color: '#555',
        borderColor: 'transparent',
        backgroundColor: '#F5F6F7',
      },
      saveBtnStyle: {
        color: '#FFF',
        border: 'none',
        background: '#F75A3E',
      },
      labelStyleObj: {
        color: '#666',
      },
      showMajorClass: false,
      showWantJob: false,
    };
  },
  async onLoad(options) {
    this.showLoading();
    if (options.scene) {
      console.log('options---------------1------->', options);
      let paramStr = decodeURIComponent(options.scene);
      let resObj = {};
      if (paramStr) {
        paramStr.split('&') &&
          paramStr.split('&').forEach((item) => {
            resObj[item.split('=')[0]] = item.split('=')[1];
          });
      }
      if (resObj.hasOwnProperty('cardType')) {
        ////兼容以前生成的二维码
        this.cardType = resObj.cardType;
        uni.setStorageSync('cardType', this.cardType);
      }
      if (resObj.hasOwnProperty('ct')) {
        this.cardType = resObj.ct;
        uni.setStorageSync('cardType', this.cardType);
      }
      if (resObj.hasOwnProperty('role')) {
        this.roleType = resObj.role;
        uni.setStorageSync('roleType', this.roleType);
      }
      if (resObj.hasOwnProperty('rightId')) {
        this.rightId = resObj.rightId;
        uni.setStorageSync('rightId', this.rightId);
      }
    } else if (options.hasOwnProperty('ct')) {
      console.log('options---------------2------->', options);

      this.cardType = options.ct || options.cardType;
      uni.setStorageSync('cardType', this.cardType);
      this.roleType = options.role;
      uni.setStorageSync('roleType', this.roleType);
      this.rightId = options.rightId;
      // uni.setStorageSync("rightId", this.rightId);
    }
    //各种处理都在init
    this.init();
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
  },
  onHide() {
    uni.hideLoading();
  },
  onShow() {
    //选择专业处理
    const selectedPositionTag = uni.getStorageSync('selectedPositionTag');
    console.log('-------------->selectedPositionTag', selectedPositionTag);

    if (selectedPositionTag) {
      this.selectedPositionTag = selectedPositionTag;
      this.form.positionTagId = selectedPositionTag.positionTagId;
      this.form.positionTag = selectedPositionTag.depName;
      this.isHasSelectMajorClass = false; //选择专业的时候，班级信息不显示
      this.reqCampusGetClassList();
    }
  },
  methods: {
    async ztBurryPointFn() {
      const params = {
        rightId: this.rightId,
        cardType: this.cardType,
        personId: this.personId,
        description: `${this.personId}点击了${rightItem.rightName}`,
      };
      const res = await ztBurryPoint(params);
    },
    init() {
      //一、确认是否已经登录
      if (!this.personId) {
        this.showLoginDialog();
        return;
      }
      // 四、请求获取是否显示班级输入框
      this.reqGetCustomerInfo();
      //1.1触发埋点
      //   this.addBuryingPointFn("40012");
      if (!this.cardType) {
        this.handleReturn();
        return;
      }
      //二、请求是否已经绑定了卡，如果绑卡了并且cardType不一致，就跳首页，如果一致或者未绑卡则继续第三步
      this.getUserInfoFn();
    },
    // 请求个人信息
    getUserInfoFn() {
      // 这个uid一定要传，因为在interceptors中，没有传参的请求的请求头不会带上uid，而这个请求一定要uid
      getUserInfo({ uid: '' }).then((res) => {
        if (res.code == 200) {
          const cardType = res.data.cardType;
          if (cardType) {
            if (cardType != this.cardType) {
              //绑定的和现在传的不一样要进行强制换绑 12月23号
              // this.handleReturn();
              this.cardRegistFn();
            } else {
              //三、请求是否这人已经绑定了学号，第四步在里面
              this.checkHasBindStudent();
            }
          } else {
            this.cardRegistFn();
          }
        }
      });
    },
    //是否已经绑定了学号
    checkHasBindStudent() {
      this.showLoading();
      const params = {
        personId: this.personId,
        cardType: this.cardType,
      };
      getStudentInfo(params)
        .then((res) => {
          if (res.code == 200) {
            //判断res.data.cardType和this.cardType是否一致，转换成数字，写出代码
            if (+res.data.cardType == +this.cardType) {
              //说明还是扫的同一个二维码
              this.form.stuNum = res.data.stuNum;
              //获取学院班级信息，后台返回的数据还要处理一下
              if (res.data.campusDepartment) {
                this.selectedPositionTag =
                  res.data.campusDepartment.children[0].children[0];
                uni.setStorageSync(
                  'selectedPositionTag',
                  this.selectedPositionTag
                );
                this.form.positionTagId =
                  this.selectedPositionTag.positionTagId;
                this.form.positionTag = this.selectedPositionTag.depName;
              }
              if (res.data.majorClass) {
                this.selecetedMajorClass = res.data.majorClass;
                this.form.majorClassId = this.selecetedMajorClass.majorClassId;
                let majorClassName = this.selecetedMajorClass.classDesc;
                if (!majorClassName) {
                  majorClassName = this.selecetedMajorClass.tagClass + '班';
                }
                this.form.majorClassName = majorClassName;
                this.isHasSelectMajorClass = true;
                console.log(
                  '-------------->res.data.majorClass',
                  this.form.majorClassName,
                  this.form.majorClassId
                );
              }
              if (res.data.extra) {
                this.form.extraDisplay = JSON.parse(res.data.extra).zwname;
                this.form.extra = res.data.extra;
              }
              console.log('-------------->this.form', this.form);
            } else {
              //说明扫的另一个cardType的二维码
              uni.removeStorageSync('selectedPositionTag');
              this.selectedPositionTag = {};
              this.form.positionTagId = '';
              this.form.positionTag = '';
              this.selecetedMajorClass = {};
              this.form.majorClassId = '';
              this.form.majorClassName = '';
              this.form.extraDisplay = '';
              this.form.extra = {};
            }
            if (this.selectedPositionTag) {
              this.reqCampusGetClassList();
            }
            if (
              (res.data.cardType == this.cardType &&
                this.form.stuNum &&
                this.form.positionTagId &&
                this.hasClassInfo &&
                this.form.majorClassId &&
                this.form.extraDisplay) ||
              (res.data.cardType == this.cardType &&
                this.form.stuNum &&
                this.form.positionTagId &&
                !this.hasClassInfo &&
                this.form.extraDisplay)
            ) {
              //如果有学号等信息就直接去相应工具页面
              console.log(
                '-------如果有学号等信息就直接去相应工具页面------->handleCopyRight',
                this.rightId
              );
              this.handleCopyRight();
            } else {
              console.log(
                '--------有问题------>handleCopyRight',
                this.form,
                res.data.cardType == this.cardType
              );
            }
          }
        })
        .catch((e) => {
          console.log(e);
        })
        .finally(() => {
          uni.hideLoading();
        });
    },
    // 换绑卡
    async cardRegistFn() {
      const params = {
        personId: this.personId,
        cardType: this.cardType,
        force: 1, //  强行绑卡 ，会触发换绑操作,一定成功
      };
      const res = await cardRegist(params);
      //三、请求是否这人已经绑定了学号，第四步在里面
      this.checkHasBindStudent();
    },
    reqGetCustomerInfo() {
      const params = {
        cardType: this.cardType,
      };
      getCustomerInfo(params)
        .then((res) => {
          if (res.code == 200) {
            let extra = res.data.extra;
            if (extra) {
              const extraObj = JSON.parse(extra);
              if (extraObj.hasClassInfo == 1) {
                this.hasClassInfo = true;
                //有班级信息的时候不要隐藏班级信息
                this.formList.splice(2, 0, {
                  label: '选择班级',
                  prop: 'majorClassName',
                  propVal: 'majorClassId',
                  inputPlaceholder: '必填',
                  comp: 'majorClass',
                  show: 'showMajorClass',
                  propList: ['majorClassId', 'majorClassName'],
                  activeParent: '',
                  required: true,
                });
                this.rules['majorClassId'] = {
                  required: true,
                  message: '请选择班级',
                };
                this.$refs.uForm.setRules(this.rules);
              }
            }
          }
        })
        .catch((e) => {
          console.log(e);
        });
    },
    reqSaveStuInfo() {
      const params = {
        ...this.form,
        personId: this.personId,
        cardType: this.cardType,
      };
      saveStuInfo(params)
        .then((res) => {
          if (res.code == 200) {
            uni.showToast({
              icon: 'success',
              title: '保存成功',
            });
            setTimeout(() => {
              this.handleCopyRight();
            }, 1000);
          } else {
            uni.showToast({
              icon: 'none',
              title: res.status_desc || '保存失败',
            });
          }
        })
        .catch((e) => {
          uni.showToast({ icon: 'none', title: '保存失败' });
          console.log(e);
        });
    },
    reqCampusGetClassList() {
      const params = {
        positionTagId: this.form.positionTagId,
        cardType: this.cardType,
      };
      campusGetClassList(params)
        .then((res) => {
          if (res.code == 200) {
            this.classList = res.data;
            if (!this.isHasSelectMajorClass) {
              this.selecetedMajorClass = {};
              this.form.majorClassId = '';
              this.form.majorClassName = '';
            }
          }
        })
        .catch((e) => {
          console.log(e);
        });
    },
    //求职意向
    handleGetWantJobParams(val) {
      console.log('val', val);
      this.showWantJob = false;
    },
    handleCloseWantJobPopup() {
      this.showWantJob = false;
    },
    //选择班级
    handleClassItemClick(item) {
      this.selecetedMajorClass = item;
    },
    handleConfirmMajorClass() {
      if (!this.selecetedMajorClass.majorClassId) {
        uni.showToast({
          icon: 'none',
          title: '请选择班级',
        });
        return;
      }
      this.form.majorClassId = this.selecetedMajorClass.majorClassId;
      let majorClassName = this.selecetedMajorClass.classDesc;
      if (!majorClassName) {
        majorClassName = this.selecetedMajorClass.tagClass + '班';
      }
      this.form.majorClassName = majorClassName;
      this.showMajorClass = false;
    },
    //点击输入框
    handleSelect(item) {
      if (item.comp == 'majorClass') {
        if (this.form.positionTagId) {
          this[item.show] = true;
        } else {
          uni.showToast({
            icon: 'none',
            title: '请先选择专业',
          });
        }
        return;
      }
      if (item.comp) {
        this[item.show] = true;
      }
      if (item.comp == 'positionTag') {
        this.jumpToPage(
          '/pagesSub/careerGrow/dataCenterShareParse/academicListPage/index'
        );
      }
    },
    handleConfirm(e, item) {
      if (Array.isArray(e)) {
        this.$set(this.form, item.prop, e[0].label);
        this.$set(this.form, item.propVal, e[0].value);
      } else {
        let time = `${e.year}-${e.month}-${e.day}`;
        this.$set(this.form, item.prop, time);
      }
    },
    handleSave() {
      this.$refs.uForm.validate((valid) => {
        if (valid) {
          this.reqSaveStuInfo();
        } else {
          uni.showToast({ icon: 'none', title: '请完善信息后保存' });
        }
      });
    },
    //埋点
    async addBuryingPointFn(etId) {
      if (!etId) {
        return;
      }
      const params = {
        etId,
        personId: uni.getStorageSync('person-id').slice(2) || '',
        cardType: this.cardType,
        jumpSource: 10,
      };
      console.log('params让我看看你是个什么东西', params);
      const res = await addBuryingPoint(params);
    },
    jumpToPage(url) {
      this.ztBurryPointFn();
      uni.navigateTo({ url });
    },
    showLoginDialog() {
      uni.setStorageSync('isZhituUser', true); //职途用户标识（注册的时候传regSource用
      this.$refs.loginDialog.setVisibility(true);
    },
    handleReturn() {
      uni.reLaunch({ url: '/pagesSub/userCenter/careerPathV2/index' });
    },
    loginSuccessBack() {
      this.personId = uni.getStorageSync('person-id').slice(2) || undefined;
      this.init();
    },
    showLoading() {
      uni.showLoading({
        title: '请稍后~',
        mask: true,
      });
      setTimeout(() => {
        uni.hideLoading();
      }, 3000);
    },
    handleGetWantJobParams(val) {
      if (val) {
        this.form.extraDisplay = JSON.parse(val).zwname;
        this.form.extra = val;
        this.showWantJob = false;
      }
    },
    handleCloseWantJobPopup() {
      this.showWantJob = false;
    },
    // 第二步：根据不同权益处理
    async handleCopyRight() {
      uni.removeStorageSync('selectedPositionTag');
      switch (+this.rightId) {
        case 1: // 性格测评 1
          if (this.roleType == 20) {
            this.addBuryingPointFn(40005);
          } else {
            this.addBuryingPointFn(40019);
          }
          await this.getCardPersonRightNumFn();
          await this.copyRightFn();
          break;
        case 2: // 职业测评 2
          if (this.roleType == 20) {
            this.addBuryingPointFn(40006);
          } else {
            this.addBuryingPointFn(40020);
          }
          await this.getCardPersonRightNumFn();
          await this.handleCareerAssessmentFn();
          break;
        case 4: // 简历诊断 4
          if (this.roleType == 20) {
            this.addBuryingPointFn(40003);
          } else {
            this.addBuryingPointFn(40017);
          }
          this.jumpToPage(
            '/pagesSub/AIResumeDiagnoseNew/index?fromSxh=fromSxhQrCode'
          );
          break;
        case 7: // 职途报告 7
          if (this.roleType == 20) {
            this.addBuryingPointFn(40007);
          } else {
            this.addBuryingPointFn(40021);
          }
          this.jumpToPage(
            `/pagesSub/userCenter/careerPathV2/components/CreateAndDeliverCareerPathReport?fromSxh=fromSxhQrCode`
          );
          break;
        case 17: // AI面评  17
          if (this.roleType == 20) {
            this.addBuryingPointFn(40004);
          } else {
            this.addBuryingPointFn(40018);
          }
          this.jumpToPage('/pagesSub/companyCenter/interviewAI/majorSearchAI'); // 列表页
          break;
        default:
          break;
      }
    },
    // 获取个人权益剩余次数
    async getCardPersonRightNumFn() {
      const params = {
        personId: this.personId || undefined,
        rightId: this.rightId,
        cardType: this.cardType,
      };
      const res = await getCardPersonRightNum(params);
      if (res.code == 200) {
        this.discLeftUseNum = res.data.ownNum - res.data.useNum;
        console.log('discLeftUseNum', this.discLeftUseNum);
      }
    },
    // 复制性格测评数据
    async copyRightFn() {
      if (this.discLeftUseNum > 0) {
        let url = '';
        if (env == 'test') {
          url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${this.personId}&iname=${this.personId}&cardType=${this.cardType}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${this.discLeftUseNum}&cardType=${this.cardType}`;
        } else if (env == 'pro' || env == 'pre') {
          url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${this.personId}&iname=${this.personId}&cardType=${this.cardType}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${this.discLeftUseNum}&cardType=${this.cardType}`;
        }
        uni.reLaunch({
          url:
            '/pagesSub/public/web/descWebView?link=' + encodeURIComponent(url),
        });
      } else {
        getPersonOneRight({
          rightId: this.rightId,
          personId: this.personId,
        }).then((res) => {
          if (res.code == 200) {
            const nowRightItem = res.data;
            const userId = nowRightItem.extra && nowRightItem.extra.userId;
            let url = '';
            if (userId) {
              if (env == 'test') {
                url = `https://3gtest.crm1001.com/disc/#/disc/result?userId=${userId}&personId=${this.personId}&iname=${this.personId}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${this.discLeftUseNum}&cardType=${this.cardType}`;
              } else if (env == 'pro' || env == 'pre') {
                url = `https://3g.crm1001.com/v2/disc/#/disc/result?userId=${userId}&personId=${this.personId}&iname=${this.personId}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${this.discLeftUseNum}&cardType=${this.cardType}`;
              }
              uni.reLaunch({
                url:
                  '/pagesSub/public/web/descWebView?link=' +
                  encodeURIComponent(url),
              });
            } else {
              if (env == 'test') {
                url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${this.personId}&iname=${this.personId}&cardType=${this.cardType}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${this.discLeftUseNum}&cardType=${this.cardType}`;
              } else if (env == 'pro' || env == 'pre') {
                url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${this.personId}&iname=${this.personId}&cardType=${this.cardType}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${this.discLeftUseNum}&cardType=${this.cardType}`;
              }
              uni.reLaunch({
                url:
                  '/pagesSub/public/web/descWebView?link=' +
                  encodeURIComponent(url),
              });
            }
          } else {
            uni.reLaunch({ url: '/pagesSub/userCenter/careerPathV2/index' });
          }
        });
        // uni.navigateTo({
        //   url: `/pagesSub/careerNew/zhituPaytoC/index?rightId=1&cardType=${this.cardType}`,
        // });
      }
    },
    // 复制职业测评数据
    async handleCareerAssessmentFn() {
      if (this.discLeftUseNum > 0) {
        uni.navigateTo({
          url: `/pagesSub/career/activity/vocationalAssessment?personId=${this.personId}&fromWhere=careerPath`,
        });
      } else {
        uni.navigateTo({
          url: `/pagesSub/careerNew/zhituPaytoC/index?rightId=2&cardType=${this.cardType}`,
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
$img-base-resume: $img-base + 'resume/';
$img-base: $img-base;
.share-parse {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0rpx 0rpx 36rpx;
  box-sizing: border-box;
  background-image: url($img-base-resume + 'newResumeBG.png');
  background-repeat: no-repeat;
  background-size: 100% 333rpx;
  background-color: #fdfeff;
  .form-top {
    margin-bottom: 78rpx;
    &-title {
      font-family: PingFang-SC, PingFang-SC;
      font-weight: 800;
      font-size: 72rpx;
      color: #222222;
      line-height: 100rpx;
      text-align: left;
      font-style: normal;
    }
    &-subtitle {
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 28rpx;
      color: #444444;
      line-height: 40rpx;
      text-align: left;
      font-style: normal;
      margin-top: 18rpx;
    }
  }
  .share-parse-form-wrap {
    flex-grow: 1;
    ::v-deep .u-form {
      padding: 32rpx 32rpx 0;
      border-radius: 24rpx;
      .u-form-item {
        padding: 32rpx 0 12rpx;
        .btn-group {
          padding: 0 24rpx;
          line-height: 102rpx;
          .cancel,
          .confirm {
            padding: 0 16rpx;
          }
        }
      }
    }
    .form-comp.majorClass {
      .classPopupContainer {
        position: relative;
        display: flex;
        flex-direction: column;
        height: 892rpx;
        .classPopupContent {
          padding: 34rpx 32rpx;
          padding-right: 12rpx;
          .classPopupTitle {
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 40rpx;
            color: #333333;
            line-height: 56rpx;
            text-align: left;
            font-style: normal;
          }
          .classPopupMajorName {
            font-family: PingFang-SC, PingFang-SC;
            font-weight: bold;
            font-size: 30rpx;
            color: #333333;
            line-height: 42rpx;
            text-align: left;
            font-style: normal;
            margin-top: 20rpx;
          }
          .classPopupYearContainer {
            margin-top: 32rpx;
            height: 575rpx;
            .classPopupYearList {
              .classPopupYearTitle {
              }
              .classPopupClassList {
                display: flex;
                flex-wrap: wrap;
                .classPopupClassItem {
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  padding: 16rpx 86rpx;
                  background-color: #f5f5f5;
                  margin-bottom: 20rpx;
                  margin-right: 20rpx;
                  font-family: PingFangSC, PingFang SC;
                  font-weight: 400;
                  font-size: 28rpx;
                  line-height: 30rpx;
                  text-align: left;
                  font-style: normal;
                  &.active {
                    background-color: #fdecec;
                    color: #f04646;
                  }
                }
              }
            }
          }
        }
        .classPopupBtn {
          width: 100%;
          .classPopupBtnItem {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 686rpx;
            height: 90rpx;
            background: #f75a3e;
            border-radius: 16rpx;
            margin: 0 auto;
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 28rpx;
            color: #ffffff;
            line-height: 40rpx;
          }
        }
      }
    }
  }
  .share-parse-opt {
    position: fixed;
    bottom: 50rpx;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding: 0 32rpx;
    width: 100vw;
    z-index: 2;
    .del-btn {
      flex-shrink: 0;
      margin-right: 40rpx;
      width: 180rpx;
      background: #f5f6f7;
      border-radius: 16rpx;
    }
    .save-btn {
      flex-grow: 1;
    }
  }
}
.u-form-item {
  ::v-deep .u-form-item__body::after {
    top: 64%;
    margin-top: 0rpx;
    background-image: url($img-base + 'career/right-arrow.png?v=1');
    width: 24rpx;
    height: 24rpx;
  }
}
::v-deep .u-form {
  .u-form-item {
    padding-top: 44rpx !important;
    .u-input input {
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 32rpx !important;
      color: #333 !important;
      line-height: 44rpx;
    }
    .u-form-item--left__content__label {
      font-family: PingFang-SC, PingFang-SC;
      font-weight: bold;
      font-size: 36rpx !important;
      color: #222222 !important;
      line-height: 44rpx;
    }
    .u-input {
      margin-bottom: 28rpx;
    }
    .u-border::after {
      border-bottom-color: #f5f5f5;
    }
  }
}
</style>
